/*
在 src\components\LightDarkSwitch\index.vue 中，
会根据用户选择来在html标签上切换theme-light 与 theme-dark 这两个类
*/
.theme-light {

  // 侧边栏
  .sidebar-container {
    background-color: $menuBg;

    .top-logo {
      color: $logoText;
    }

    .menu {
      background-color: $menuBg;

      .el-menu {
        background-color: rgba(0, 0, 0, 0);

        // 主菜单
        .el-menu-item,
        .el-sub-menu__title,
        .el-sub-menu {
          color: $menuText;

          &:hover {
            background-color: $menuHover;
          }

          &.is-active {
            color: $menuActiveText;
          }
        }

        // 子菜单
        .el-sub-menu {
          & .el-menu-item {
            background-color: $subMenuBg;

            &:hover {
              background-color: $subMenuHover;
            }

            &.is-active {
              color: $subMenuActiveText;
            }
          }
        }


      }
    }

    .darg-line {
      border-right: 1px solid $dargLineBG;
    }
  }

  // 导航栏
  .navbar-container {
    background-color: $narBarBg;

    .left {
      .menu {
        .el-breadcrumb__inner {
          color: $narBarText !important;
        }

        .el-breadcrumb__inner.is-link:hover {
          color: rgb(0, 140, 255) !important;
        }

        .el-breadcrumb__item:last-child .el-breadcrumb__inner,
        .el-breadcrumb__item:last-child .el-breadcrumb__inner a,
        .el-breadcrumb__item:last-child .el-breadcrumb__inner a:hover,
        .el-breadcrumb__item:last-child .el-breadcrumb__inner:hover {
          font-weight: 400;
          color: #606266 !important;
          cursor: text;
        }
      }

    }

    .right {
      .shortcut {
        background: $shortcutBg;
      }
    }
  }

  // TagsView
  .tags-view-container {
    border-top: 1px solid $tagsViewBorder;
    border-bottom: 1px solid $tagsViewBorder;
    background-color: $tagsViewBg;
  }

  // 主内容
  .appmain-container {
    background-color: $appMainBg;
    color: $appMainText;
    //TODO:为你的html内容添加自己的亮色样式
    //例如：
    // .your-class {
    //   background: #fff;
    // }
  }
}